package com.gehj.commonui;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.util.TypedValue;
import android.view.View;

import androidx.annotation.Nullable;


/**
 * 自定义View(10)＊onSizeChanged,onMeasure,onDraw的注意事项及正确写法
 * https://blog.csdn.net/banyinlve3147/article/details/102012865
 *
 * Android 首页TAB突出部分的布局
 * https://www.jianshu.com/p/9e9e42b76309
 * @author gehj
 * @date 2021/3/3 15:53
 */

public class OutView extends View {

    /**
     * 线的高度
     */
    public int mLineHeight = 1;
    /**
     * 线的颜色
     */
    private int mLineColor;
    /**
     * 中间的线宽度
     */
    private int mDistance;

    /**
     * 夹角
     */
    private double Q = Math.PI / 4;
    /**
     * 圆的半径
     */
    private float mRadius;

    /**
     * 圆偏移的距离
     */
    private int mOffsetY;

    private Paint mPaint;
    private float angle = 30; //这个角度本来应该自己设置，但是改成画弧线后角度调整会严重影响弧的位置
    private RectF mRect;
    private float stopX;
    private float top;

    public OutView(Context context) {
        super(context);
    }

    public OutView(Context context, @Nullable AttributeSet attrs) {
        this(context, attrs, 0);//2调3
    }

    /**
     * 自定义属性 xml里可以用
     * @param context
     * @param attrs
     * @param defStyleAttr
     */
    public OutView(Context context, @Nullable AttributeSet attrs, int defStyleAttr){
        super(context, attrs, defStyleAttr);
        TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.OutView);
        mLineHeight = (int) array.getDimension(R.styleable.OutView_outViewLineHeight,
                dip2px(mLineHeight));
        mLineColor = array.getColor(R.styleable.OutView_outViewLineColor,
                Color.parseColor("#dddddd"));
        mDistance = (int) array.getDimension(R.styleable.OutView_outViewDistance,
                dip2px(20));
        /*angle = array.getFloat(R.styleable.OutView_outViewOffsetAngle,
                30);*/

        array.recycle();
        // rad(弧度) = deg(角度) *  PI / 180
        Q = angle * Math.PI / 180;

        mPaint = new Paint();
        mPaint.setAntiAlias(true);
        mPaint.setDither(true);
        mPaint.setColor(mLineColor);
        mPaint.setStrokeWidth(mLineHeight);

    }

    /**
     * https://blog.csdn.net/banyinlve3147/article/details/102012865
     *
     * onSizeChanged 是当view的第一次分配大小或以后大小改变时的产生的事件
     * 计算绘制内容的位置，面积等相关值。避免每次在onDraw中计算了
     * onMeasure 当父控件布局时要测量子控件的大小时候调用 解析传来的参数，设置各绘制内容大小
     * @param w
     * @param h
     * @param oldw
     * @param oldh
     */
    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        // 圆的半径
        mRadius = (float) (mDistance / 2 / Math.cos(Q));

        // 圆心向下偏移的距离
        mOffsetY = (int) (mDistance / 2 * Math.tan(Q));


        //左线的终点，圆弧的起点
        stopX = (getWidth() - mDistance) / 2;
        //长方形的上坐标 =getHeight- (y+ （圆半径 - 高度）)；
        top = (float)(getHeight() - (mRadius -  mRadius*(Math.sin(Q))));
        //画圆弧的方框
        //通过实验可以观察到，画方形的话是左上与右下两个点，其中0，0点是本view的左上角.top的正值往下移动
        //下面的-10是为了调整间隙而增加的，不同的手机上还不一样，应该是padding导致的，需要深入再研究。
        //https://blog.csdn.net/qq_38436214/article/details/107983588 Android 自定义View 之 RectF用法详解
        mRect = new RectF(stopX -10, top, stopX +2*mRadius-10,
                 top +2*mRadius);
        // RectF mRect = new RectF(0,0,mRadius+100,mRadius+200);

    }



    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        // 画左边的线
        mPaint.setStyle(Paint.Style.FILL);
        float y = getHeight() - mLineHeight / 2;//顺着底部画
        canvas.drawLine(0, y, stopX, y, mPaint);




        // 画圆
        mPaint.setStyle(Paint.Style.STROKE);
        /*canvas.drawCircle(getWidth() / 2,
                getHeight() + mOffsetY, mRadius, mPaint);*/


        //其他参数：起始角度，最终角度,是否画圆形，画笔
        float startAangle = -angle;//正从左侧的0往第三象限走的 负的的话从左侧0变到第一象限
        float sweepAngle = 2*angle - 180; //倒着扫 正着扫是顺时针
        //canvas.drawRect(mRect,mPaint);
        //画弧的话是以右侧为开始，往下画，长宽的1/2是圆心
        //画弧首先要画长方形，长方形画好了在画需要扫描的角度
        canvas.drawArc(mRect,startAangle,sweepAngle,false,mPaint);

        // 画线
        mPaint.setStyle(Paint.Style.FILL);
        canvas.drawLine(stopX + mDistance, y, getWidth(), y, mPaint);

    }

    private float dip2px(int value) {
        return TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, value, getResources().getDisplayMetrics())
                + 0.5f;
    }

}
